<template>
  <div class="main">
    <div class="top">
      <img src="/static/images/index/yes.png" alt />
    </div>
    <div class="middle">
      <img src="/static/images/index/success.png" alt />
    </div>
    <div class="bottom">
      <button class="check-ative" @click="goApplyDetail(id)">查看活动</button>
      <button class="returnIndex" @click="goIndex">返回首页</button>
    </div>
  </div>
</template>

<script>
export default {
  props: {},
  data () {
    return {
      id: ''
    };
  },
  computed: {},
  created () {},
  mounted () {
    console.log(this.$mp.query.classifyId);
    this.id = this.$mp.query.classifyId;
  },
  watch: {},
  methods: {
    // 点击返回首页
    goIndex () {
      wx.switchTab({ url: '/pages/index/index/main' });
    },
    // 跳转到报名详情页面
    goApplyDetail (id) {
      wx.navigateTo({
        url: `/pages/PersonalCenter/userChildren/active/applyDetail/main?classifyId=${id}`
      });
    }
  },
  components: {}
};
</script>

<style scoped lang="less">
.top {
  padding: 49px 130px 18px;
  width: 116px;
  height: 116px;
  img {
    width: 100%;
    height: 100%;
  }
}
.middle {
  width: 100%;
  height: 116px;
  img {
    width: 100%;
    height: 100%;
  }
}
.bottom {
  padding: 15px 28px 0 27px;
  button {
    height: 46px;
    margin-bottom: 15px;
    border-radius: 2px;
    font-size: 15px;
    font-family: PingFangSC-Medium, PingFangSC;
    font-weight: 700;
    line-height: 46px;
  }
  .check-ative {
    background: rgba(24, 119, 152, 1);
    color: rgba(255, 255, 255, 1);
  }
  .returnIndex {
    background: #fff;
    color: rgba(24, 119, 152, 1);
    border: 1px solid #187798ff;
  }
}
</style>
